Ext.define('ProjectAON.view.evaluatiesBeheren.Scherm33', {
    extend:'Ext.panel.Panel',
    alias:'widget.scherm33',

    title:'Vakken',
    buttons:null,

    initComponent:function () {
    var me = this;
        var array = Ext.StoreMgr.lookup("Vak");
        var arrayItems = [];
        var i = 0;
        array.each(function (model) {
            arrayItems[i] = (model.data.naam);
            i++;
        });
        var buttons = [];
        for (var i = 0; i < arrayItems.length; i++) {
            var cls;
            if (i > 7) {
                var hulp = (i + 1) % 8;
                cls = 'kleur' + hulp;
            } else {
                cls = 'kleur' + (i + 1);
            }
            buttons.push({
                xtype:'button',
                height:200,
                width:200,
                text:arrayItems[i],
                action:'scherm34',
                cls:cls
            });
        }

        Ext.applyIf(this, {
            layout:'border',
            items:[
                {
                    region:'north',
                    xtype:'panel',
                    items:[
                        {
                            xtype:'button',
                            text:'Terug',
                            icon:'http://whatisextjs.com/BAHO/icons/page_back.png',
                            action:'back'
                        },
                        {
                            xtype:'textfield',
                            emptyText:'Press enter',
                            fieldLabel:'Search:',
                            cls:'zoekButton',
                            name:'searchField'
                            /*listeners:{
                                change:{
                                    fn:me.filterButtons,
                                    buffer:100
                                }
                            }*/
                        }
                    ]
                },
                {
                    region:'center',
                    autoScroll:true,
                    items:[
                        {
                            xtype:'panel',
                            plain:true,
                            border:false,
                            cls:'midden',
                            width:920,
                            items:buttons
                        }
                    ]
                }
            ]
        });
        this.callParent(arguments);

    }
});